<template>
	<view class="disp flex-row center between item_info uni-white-bg uni-ma-10 uni-py-10" @click="go">
		<view class="item-left disp center">
			<view class="show_circle"  v-if="delShow && edit == 0">
				<uni-icons type="circle-filled" size="25" v-if="checkRow" color="#9fd998"></uni-icons>
				<uni-icons type="circle" size="25" v-else color="#9fd998"></uni-icons>
			</view>
			<image v-if="item.avatar" :src="item.avatar" class="img uni-ml-20"></image>
			<image v-else :src="avatar" class="img uni-ml-20"></image>
			<view class="info uni-ml-20">
				<view class="top basic-label fs32 PF-M">{{item.realName}}</view>
			</view>
		</view>
		<image class="item-right uni-mr-20"
			src="https://lives-1308318918.cos.ap-shanghai.myqcloud.com/img/center/arrow.png" mode="widthFix"> </image>
	</view>
</template>

<script>
	export default {
		props:{
			item: {},
			edit: {
				type: Number,
				default: 0
			},
			isDel:  {
				type: Boolean,
				default: false
			},
			checkStu: {
				type: Array,
				default: ()=>[]
			}
		},
		name: "student",
		data() {
			return {
				avatar : 'https://lives-1308318918.cos.ap-shanghai.myqcloud.com/images/default.png',
				checkRow: false,
				delShow: false
			};
		},
		watch: {
			isDel(newv) {
				console.log(newv);
				console.log(this.edit);
				this.delShow = newv;
			},
			checkStu: {
				deep: true,
				immediate: true,
				handler(newv){
					if (newv.indexOf(this.item.stuId) == -1) {
						this.checkRow = false;
					} else{
						this.checkRow = true;
					}
				}
			}
		},
		methods: {
			//选择学员
			go() {
				if (this.delShow) {
					this.checkRow = !this.checkRow;
					this.$emit("checkRow", this.item.stuId);
				} else {
					if (this.edit == 0) {
						uni.navigateTo({
							url: `/pages/summer/student_info/index?stuid=${this.item.stuId}`
						})
					}else {
						this.$emit("edit", this.item);
					}
				}
				
			}
		}
	}
</script>

<style lang="scss" scoped>
	.item-left .img {
		width: 100rpx;
		height: 100rpx;
		border-radius: 10rpx;
		margin-right: 30rpx;
	}

	.item-right {
		width: 24rpx;
		height: 24rpx;
	}
	.item_info {
		width: 96%;
		border-radius: 10rpx;
	}
</style>